<template>
  <div class="app-container">
    <div :class="'van-after-border '+item.class">
      <van-field name="esign" :label="item.label">
        <template #input>
          <van-image v-if="resultImg!=''" width="4rem" height="1.5rem" fit="contain" :src="resultImg" @click="showEsign" />
          <div v-else class="esign-card" @click="showEsign"><p>点击签名</p></div>
        </template>
      </van-field>
    </div>
    <van-popup v-model="showPop" style="width:100%;height:100%">
      <div class="esign-main">
        <van-nav-bar title="绘制个人签名" left-text="" left-arrow @click-left="onClickLeft" />
        <div class="esign">
          <div class="esign-box">
            <vue-esign ref="esign" class="esignature" :width="width" :height="height" :is-crop="isCrop" :line-width="lineWidth" :line-color="lineColor" :bg-color.sync="bgColor" :sratiox="sratio" />
          </div>
          <div class="esigh-btns">
            <button @click="handleReset" class="button-clear">清除重写</button>
            <button @click="handleGenerate" class="button-agree">提交签字</button>
          </div>
          <!--<div class="esigh-result">
            <img v-if="resultImg" :src="resultImg" alt="" />
          </div>-->
        </div>
      </div>
    </van-popup>
  </div>
</template>

<script>

export default {

}
</script>

<style>

</style>
